<!DOCTYPE html>
<html xmlns:th="https://www.thymeleaf.org" th:replace="~{component/layout :: html(content = ~{::content})}">
<th:block th:fragment="content">
    <div class="hero min-h-screen global-bg flex flex-col items-center justify-start"
         th:with="globalConfig=${theme.config.global}"
         th:style="${not #strings.isEmpty(globalConfig.images)} ? 'background-image: url(' + ${globalConfig.images} + ')' : ''">
        <div th:if="${globalConfig.overlay_Show}"
             class="hero-overlay min-h-screen"
             id="global-overlay"
             th:classappend="'bg-opacity-' + ${globalConfig.overlay_opacity}
         +' bg-' + ${globalConfig.overlay_color}
         + ' backdrop-' + ${globalConfig.overlay_blur}"></div>
        <div class="flex flex-col items-center justify-start w-3/4 bg-base-100 px-8 pt-4 shadow-2xl" id="archives_content">
            <th:block th:replace="~{component/widget/archives_breadcrumbs}"/>
            <th:block th:each="archive : ${archives.items}">
                <ul class="w-full">
                    <th:block th:each="month : ${archive.months}">
                        <div class="flex flex-wrap w-full">
                            <li th:each="post : ${month.posts}" class="max-w-full basis-1/2 py-2">
                                <th:block th:replace="~{component/widget/archives_card}"/>
                            </li>
                        </div>
                    </th:block>
                </ul>
            </th:block>
            <div th:if="${archives.hasPrevious() || archives.hasNext()}">
                <a th:href="@{${archives.prevUrl}}">
                    <span>上一页</span>
                </a>
                <span th:text="${archives.page} +' / '+ ${archives.totalPages}"></span>
                <a th:href="@{${archives.nextUrl}}">
                    <span>下一页</span>
                </a>
            </div>
        </div>
    </div>
</th:block>
</html>

<style>
    #archives_content {
        z-index: 2; /* 内容层级 */
    }
</style>
